<template>
  <div class="home-head">
    <div class="logo_box">
      <img src="https://m.800pharm.com/images/wap/icon_logo.png" alt="八百方" />
    </div>
    <div class="search" @click="$router.push('/search')">
      <span>搜索药品名/症状</span>
       <van-icon size="24" name="search" />
    </div>
    <div class="denglu">
      <span>登录</span>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.home-head {
  background-color: rgb(19, 72, 157);
  display: flex;
  height: 50px;
  align-items: center;
}
.logo_box {
  margin-top: 10px;
  margin-left: 5px;
  img {
    width: 63px;
  }
}
.search {
  flex: 1;
  height: 30px;
  border: 1px solid #ccc;
  border-radius: 16px;
  background-color: rgba(255, 255, 255, 0.9);
  line-height: 46px;
  font-size: 14px;
  color: #666;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 5px;
  .van-icon {
    margin: 0 5px;
  }
}
.search span{
  margin-left: 5px;
}
.denglu{
  color: #fff;
  text-align: center;
  font-size: 15px;
  margin-right: 5px;
}
</style>
